<template>
    <div class="dialog">
        <el-dialog :title="nowChanceStau === 'pass'?'通过确认':'不通过原因'" :visible.sync="showDialog" width="25%" top="0" :close-on-click-modal="false" @close="cancel">
            <el-form ref="ruleForm" v-if="nowChanceStau === 'unpass'" label-position="left" :model="formData" :rules="rules" class="el-form">
                <el-form-item label="不通过原因: " prop="failReason" class="w100p">
                    <el-input type="textarea" :disabled="dialogParams.auditType!=='REVIEW'" :rows="3" placeholder="请输入内容" v-model="formData.failReason">
                    </el-input>
                </el-form-item>
            </el-form>
            <div v-else class="font-cls"><span>确定通过审核吗?</span></div>
            <div slot="footer" class="dialog-footer">
                <el-button class="cancelbtn" @click="cancel()">取 消</el-button>
                <el-button type="primary" v-if="dialogParams.auditType==='REVIEW'" class="savebtn" @click="save('ruleForm')">{{nowChanceStau=='unpass'?"保 存":"确 定"}}</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
export default {
    name: "",
    components: {},
    props: {
        nowChanceStau: {
            type: String,
            default: "",
        },
        show: {
            type: Boolean,
            default: false,
        },
        dialogParams: {
            type: Object,
            default: () => {
                return {};
            },
        },
    },
    data() {
        return {
            rules: {
                failReason: [
                    {
                        required: true,
                        message: "请输入未通过原因",
                        trigger: ["change", "blur"],
                    },
                ],
            },
            showDialog: this.show,
            formData: {
              failReason:''
            },
        };
    },
    watch: {
        show(v) {
            this.showDialog = v;
            this.resetFields();
        },
        "dialogParams.failReason": {
            handler(v) {
                this.formData.failReason = v;
                if (this.dialogParams.auditType !== "REVIEW" && !v) {
                    this.formData.failReason = "暂无原因！";
                }
            },
            deep: true,
        },
    },
    methods: {
        save(formData) {
            if (this.nowChanceStau == "pass") {
                this.submitAudite();
            } else {
                this.$refs[formData].validate((valid) => {
                    if (valid) {
                        this.submitAudite();
                    } else {
                        return false;
                    }
                });
            }
        },
        submitAudite() {
            this.$emit("submitAudite", {
                failReason: this.formData.failReason,
            });
        },
        cancel() {
            this.$emit("cancelDialog");
        },
        resetFields() {
            this.$refs["ruleForm"] && this.$refs["ruleForm"].resetFields();
        },
    },
};
</script>

<style lang="scss" scoped>
.font-cls {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    font-size: 20px;
}
</style>
